<template>
  <div>
    <el-dialog
      title="选择负责人"
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      :modal-append-to-body="true"
      :append-to-body="true"
      width="900px">
      <el-form :model="queryParams" ref="queryForm" :inline="true">
        <el-form-item label="姓名" >
          <el-input
            v-model="queryParams.nickName"
            placeholder="请输入姓名"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="资质证书" >
          <el-select v-model="queryParams.aptitudes" placeholder="" style="width:100%; ">
            <el-option
              v-for="item in zzsArr"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
          <el-button type="primary"  size="mini" @click="determine">确 定</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="loading" :data="chanpinList" stripe
                @selection-change="chanpinonChange" >
        <el-table-column align="center" type="selection" width="55"></el-table-column>
        <el-table-column align="center" type="index" label="序号"  width="55"  />
        <el-table-column  align="center"  prop="nickName" label="姓名" ></el-table-column>
        <el-table-column  align="center"  prop="sex" label="性别">
          <template slot-scope="scope" >
            <span v-show="scope.row.sex=='0'">男</span>
            <span v-show="scope.row.sex=='1'">女</span>
            <span v-show="scope.row.sex=='2'">未知</span>
          </template>
        </el-table-column>
        <el-table-column  align="center"  prop="aptitudes" label="资质证书" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column  align="center"  prop="unfinishedWorkNumber" label="未完成工单数" ></el-table-column>
      </el-table>
      <pagination
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />

    </el-dialog>
  </div>
</template>

<script>
  import request from '@/utils/request'
  export default {
    props: ['routerData'],
    name: "Role",
    data() {
      return {
        total:0,
        loading:false,
        dialogTableVisible:true,
        //产品查询数据
        queryParams:{
          pageNum: 1,
          pageSize: 10,
          name:'',
          aptitudes:'',
          responsibilityId:'device003-01',
        },
        //资质证书数据
        zzsArr:[
          {value:'1',label:'测试数据'}
        ],
        newxuanz:'',//当前选中的
        deptOptions:[],//树形图数据
        defaultProps: {
          children: "children",
          label: "label"
        },
        //产品列表数据
        chanpinList:[],
        xunArr:[],

      };
    },
    components:{

    },
    watch: {
      dialogTableVisible: function () {
        this.dialogTableVisible = true;//始终让他为true;
        this.cancel();//隐藏
      },
    },
    created() {
      console.log('接受',this.routerData)
      this.getList()
    },
    methods: {
      /** 查询责任人列表 */
      getList() {
        this.loading = true;
        request({
          url: '/device/implementer/newlist',
          method: 'get',
          params:this.queryParams
        }).then(response => {
          this.loading = false;
          this.chanpinList = response.rows
          this.total = response.total
        });
      },
      //确定
      determine:function(){
        this.$emit('callback',this.xunArr)//将submitModel的值传给父组件
      },
      //隐藏
      cancel:function(){
        this.$emit('callback')

      },
      //产品表格监听
      chanpinonChange(val) {
        console.log(val)
        this.xunArr = val

      }
    }
  };
</script>
<style >





</style>
